<template>
    <a href="#" @click="divClick">
        grandfather
        <!-- 这里也会阻止子级a标签的默认行为，但不会阻止父级的 -->
        <a href="#" @click.prevent.self.ctrl="buttonClick"> 
             father
            <!-- 如果这里的click添加了stop修饰符，那么父级的prevent又不会对它生效了 -->
            <a @click.stop="pClick" href="#"> 按钮</a>
        </a>
    </a>
</template>
<script>
export default {
    methods: {
        divClick(...args){
            console.log('grandfather a clicked!!', args);
        },
        buttonClick(...args){
            console.log('father a clicked!!', args);
        },
        pClick(...args){
            console.log('a clicked!!', args);
        },
    }
}
</script>